<%-- 
    Document   : index
    Created on : 14/01/2015, 02:30:51 PM
    Author     : afuentes
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
        <script type="text/javascript">
            function trasladar(){
                //var todos = document.getElementById('todos').value;
                //var sTodos = todos.toString();
                //var todosArray = sTodos.split(',');
                //document.getElementById('solo1').value = todosArray[0];
                var todosArray = document.getElementById('todos').files;
                document.getElementById('solo1').value = todosArray[0].name;
                document.getElementById('solo2').value = todosArray[1].name;
                document.getElementById('solo3').value = todosArray[2].name;
                document.getElementById('solo4').value = todosArray[3].name;
                document.getElementById('solo5').value = todosArray[4].name;
            }
        </script>
    </head>
    <body>
        <h1>Hello World!</h1>
        <form method="POST" action="/FileMultipleJQuery/ServletArchivos" enctype="multipart/form-data">
            <table >
                <tr>
                    <td colspan="3">
                        <input type="file" name="todos" multiple id="todos" onchange="trasladar();" maxlength="10" >
                    </td>
                </tr>
                <tr>
                    <td>
                <input type="text" name="solo1" id="solo1">
                    </td>
                    
                    <td>
                <input type="text" name="desc1" id="desc1">
                    </td>
                </tr>
                <tr>
                    <td>
                <input type="text" name="solo2" id="solo2">
                    </td>
                    
                    <td>
                <input type="text" name="desc2" id="desc2">
                    </td>
                </tr>
                <tr>
                    <td>
                <input type="text" name="solo3" id="solo3">
                    </td>
                    <td>
                <input type="text" name="desc3" id="desc3">
                    </td>
                </tr>
                <tr>
                    <td>
                <input type="text" name="solo4" id="solo4">
                    </td>
                    <td>
                <input type="text" name="desc4" id="desc4">
                    </td>
                </tr>
                <tr>
                    <td>
                <input type="text" name="solo5" id="solo5">
                    </td>
                    <td>
                <input type="text" name="desc5" id="desc5">
                    </td>
                </tr>
                <tr>
                    <td>
                        <input type="submit" value="Enviar">
                    </td>
                </tr>
            </table>
        </form>
    </body>
</html>
